<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div class="container-fluid">

    <link rel="stylesheet" href="/static/dist/lib/datetimepicker/datetimepicker.css">
    <link rel="stylesheet" href="/static/dist/lib/chosen/chosen.css">

    <link href="/static/umeditor/themes/default/css/ueditor.css" type="text/css" rel="stylesheet">

    <style>
        .webuploader-container {
            position: relative;
        }
        .webuploader-element-invisible {
            position: absolute !important;
            clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
            clip: rect(1px,1px,1px,1px);
        }
        .webuploader-pick {
            position: relative;
            display: inline-block;
            cursor: pointer;
            color: #fff;
            background-color: #ffffff00;
            border-color: #ffffff00;
            text-align: center;
            border-radius: 3px;
            overflow: hidden;
        }
        .webuploader-pick-hover {
            background-color: #ffffff00;
            border-color: #ffffff00;
        }
        .webuploader-pick-disable {
            opacity: 0.6;
            pointer-events:none;
        }
    </style>
    <div class="row">
        <div class="col-md-12">活动发布</div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <form id="activityInfo-form-add" name="activityInfoForm" enctype="multipart/form-data" method="post" >
                <fieldset>
                    <div class="form-group">
                        <div class="row">
                            <!-- 活动内容区域 -->
                            <div class="col-md-9">
                                <div class="input-control has-label-left-sm">


                                    <div id="layout">
                                        <div id="test-editormd">
                                            <!--<textarea id="editormd-markdown-textarea"># 欢迎使用 Cmd Markdown 编辑阅读器</textarea>-->
                                            <!--style给定宽度可以影响编辑器的最终宽度-->
                                            <div id="myEditor" style="width:100%;height:740px;">
                                            </div>
                                        </div>
                                    </div>


                                </div>
                            </div>


                            <!-- 活动属性区域 -->
                            <div class="col-md-3">
                                <div class="input-control has-label-left-lg">

                                    <div class="row">
                                        <div class="form-group">
                                            <button type="button" class="btn btn-primary" id="user_btn_save">保存草稿</button>
                                            <button type="button" class="btn btn-primary" id="user_btn_push">发布</button>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">名称</label>
                                            <input type="text" name="name" id="activityName" class="form-control" placeholder="活动名称" />
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">主题</label>
                                            <input type="text" name="title" id="activityTitle" class="form-control" placeholder="活动主题" />
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">出发地</label>
                                            <div class="input-group"  data-link-field="dtp_input1" placeholder="出发地" >
                                                <span class="input-group-addon" id="fromAddress" style="cursor:pointer;" onclick="openModalTrigger('fromAddress')"><span class="icon-location-arrow"></span></span>
                                                <input class="form-control" size="16" type="text" value="" name="departure" id="fromAddressText">
                                                <input type="hidden" value="" id="fromAddressLnglat">
                                                <span class="input-group-addon"><span class="icon-remove"></span></span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">目的地</label>
                                            <div class="input-group"  data-link-field="dtp_input1" placeholder="目的地" >
                                                <span class="input-group-addon" id="destinationAddress" style="cursor:pointer;" onclick="openModalTrigger('destinationAddress')"><span class="icon-location-arrow"></span></span>
                                                <input class="form-control" size="16" type="text" value="" name="destination" id="destinationAddressText">
                                                <input type="hidden" value="" id="destinationAddressLnglat">
                                                <span class="input-group-addon"><span class="icon-remove"></span></span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">出发时间</label>
                                            <div class="input-group date form-datetime"  data-link-field="dtp_input1" placeholder="出发时间" >
                                                <span class="input-group-addon"><span class="icon-th"></span></span>
                                                <input class="form-control" name="startTimeStr" id="activityStartTime" size="16" type="text" value="" readonly="">
                                                <span class="input-group-addon"><span class="icon-remove"></span></span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">结束时间</label>
                                            <div class="input-group date form-datetime"  data-link-field="dtp_input1" placeholder="出发时间" >
                                                <span class="input-group-addon"><span class="icon-th"></span></span>
                                                <input class="form-control" name="endTimeStr" id="activityEndTime" size="16" type="text" value="" readonly="">
                                                <span class="input-group-addon"><span class="icon-remove"></span></span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">人数上限</label>
                                            <input type="text" name="maximumPeople" id="maximumPeople" class="form-control" placeholder="人数上限" />
                                        </div>
                                    </div>



                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">活动类型</label>
                                            <select class="form-control" name="type" id="activityType">
                                                <option value="">无</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">集合时间</label>
                                            <div class="input-group date form-datetime"  data-link-field="dtp_input1" placeholder="集合时间" >
                                                <span class="input-group-addon"><span class="icon-th"></span></span>
                                                <input class="form-control" size="16" name="meetingTimeStr" id="meetingTime" type="text" value="" readonly="">
                                                <span class="input-group-addon"><span class="icon-remove"></span></span>
                                            </div>
                                        </div>
                                    </div>


                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">是否产生费用</label>
                                            <input type="hidden" name="isCost" id="isCostInput" value="0">
                                            <div class="switch">
                                                <input type="checkbox" id="isCost" value="0">
                                                <label>是否产生费用</label>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row" id="cost_row" style="display: none;">
                                        <div class="form-group">
                                            <label class="label">活动费用</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">￥</span>
                                                <input type="number" class="form-control" name="cost" value="0" id="activityCost" placeholder="请输入活动费用金额">
                                                <span class="input-group-addon">.00</span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">是否开启报名</label>
                                            <input type="hidden" name="isRegister" id="isRegisterInput" value="0">
                                            <div class="switch">
                                                <input type="checkbox" id="isRegister" value="0">
                                                <label>是否开启报名</label>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row register_row" style="display: none;">
                                        <div class="form-group">
                                            <label class="label">报名开始时间</label>
                                            <div class="input-group date form-datetime"  data-link-field="dtp_input1" placeholder="报名开始时间" >
                                                <span class="input-group-addon"><span class="icon-th"></span></span>
                                                <input class="form-control" size="16" name="registerStartTimeStr" id="registerStartTime" type="text" value="" readonly="">
                                                <span class="input-group-addon"><span class="icon-remove"></span></span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row register_row" style="display: none;">
                                        <div class="form-group">
                                            <label class="label">报名截至时间</label>
                                            <div class="input-group date form-datetime"  data-link-field="dtp_input1" placeholder="报名截至时间" >
                                                <span class="input-group-addon"><span class="icon-th"></span></span>
                                                <input class="form-control" size="16" name="registerEndTimeStr" id="registerEndTime" type="text" value="" readonly="">
                                                <span class="input-group-addon"><span class="icon-remove"></span></span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="form-group">
                                            <label class="label">活动封面</label>
                                            <div>
                                                <img id="coverImg" src="http://openzui.com/docs/img/img4.jpg" width="200px" height="200px" class="img-responsive" alt="响应式图片测试">
                                                <input name="coverImg" id="coverImgInput" type="hidden" value="http://image.bkybk.com/FsF3T2J_DZlIg24KHKV-pxQSyoPl">
                                            </div>
                                            <div>
                                                <button type="button" class="btn" id="uploadFile">简单上传按钮</button>
                                            </div>


                                        </div>
                                    </div>






                                </div>
                            </div>

                        </div>
                    </div>

                </fieldset>
            </form>
        </div>
    </div>

    <div id="myStyleModal"></div>



    <script src="/static/dist/lib/datetimepicker/datetimepicker.js"></script>
    <script src="/static/dist/lib/chosen/chosen.js"></script>
    <script src="/static/webuploader/webuploader.js"></script>

    <script type="text/javascript" charset="utf-8" src="/static/umeditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="/static/umeditor/ueditor.all.js"></script>
    <script type="text/javascript" src="/static/umeditor/lang/zh-cn/zh-cn.js"></script>


    <script type="text/javascript">


        UE.registerUI('dialog',function(editor,uiName){
            console.log(editor);
            console.log(uiName);

            //参考addCustomizeButton.js
            var btn = new UE.ui.Button({
                name:'dialogbutton' + uiName,
                title:'dialogbutton' + uiName,
                //需要添加的额外样式，指定icon图标，这里默认使用一个重复的icon
                cssRules :'background-position: -500px 0;',
                onclick:function () {
                    //渲染dialog
                    console.log('渲染dialog');
                }
            });

            return btn;


        });/*index 指定添加到工具栏上的那个位置，默认时追加到最后,editorId 指定这个UI是那个编辑器实例上的，默认是页面上所有的编辑器都会添加这个按钮*/

        UE.getEditor('myEditor',{
            toolbars:[[]]
        });
    </script>
</div>
</body>
</html>